iOS 13使用LaunchScreen.storyboard适配各尺寸启动图
From: https://www.lizenghai.com/archives/43641.html
目录
- 背景
- 方案一:图片直接拉伸
- 方案二:autolayout 排版内容
- 方案三:还是使用多图片适配
- 添加图片
- 设置启动图
- 最后
背景
苹果在2019年WWDC中提出,到2020年4月开始,使用 iOS 13 SDK 的 App 必须使用 LaunchScreen,相应的LuanchImage 也要退出历史的舞台。但是现在苹果手机尺寸也越来越丰富了,很难找到一种适配各种尺寸启动图的方式。下面我就根据网上的例子与自己研究给出几种方案。
方案一:图片直接拉伸
1、直接在 LaunchScreen.storyboard 中添加 UIImageView,autolayout 设置边距都为0。
2、 设置图片的的 Content Mode 为 Aspect Fill。
3、然后直接添加默认尺寸的图片就可以了。
这种做法简单粗暴,直接对图片进行拉伸适配了,对于启动图来说如果四边空白位置比较多也是没有问题。或者根据自己的图片通过设置 stretching 设置各个方向的拉伸的位置大小,具体方式大家自行研究了。
方案二:autolayout 排版内容
这种方式就不要在把启动页面看成是一张图片了,直接把它当成一个页面,放进我们需要显示的控件,使用 autolayout 正常布局适配。
这是个人最为推荐的一种方式,能够更加灵活的适配各尺寸。
方案三:还是使用多图片适配
这种方式本质上跟使用 LaunchImage 好像没什么区别,但是我们在嫌麻烦的或者不得不使用多启动图的时候,这也不失为一种解决方式。
添加图片
1、在 Assets.xcassets 中 New Image Set
2、把所有尺寸图片添加进图片文件夹下
3、进入图片文件夹中,编辑 Contents.json,把里面的内容改成如下内容:
{
"images" : [
{
"idiom" : "iphone",
"scale" : "1x"
},
{
"idiom" : "iphone",
"filename" : "640x960.png",
"scale" : "2x"
},
{
"idiom" : "iphone",
"scale" : "3x"
},
{
"idiom" : "iphone",
"subtype" : "retina4",
"scale" : "1x"
},
{
"idiom" : "iphone",
"filename" : "640x1136.png",
"subtype" : "retina4",
"scale" : "2x"
},
{
"idiom" : "iphone",
"subtype" : "retina4",
"scale" : "3x"
},
{
"idiom" : "iphone",
"filename" : "1242x2208.png",
"subtype" : "736h",
"scale" : "3x"
},
{
"idiom" : "iphone",
"filename" : "750x1334.png",
"subtype" : "667h",
"scale" : "2x"
},
{
"idiom" : "iphone",
"filename" : "1125x2436.png",
"subtype" : "2436h",
"scale" : "3x"
},
{
"idiom" : "iphone",
"filename" : "1242x2688.png",
"subtype" : "2688h",
"scale" : "3x"
},
{
"idiom" : "iphone",
"filename" : "828x1792.png",
"subtype" : "1792h",
"scale" : "2x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
保存之后变成如下所示:
设置启动图
1、在 LaunchScreen.storyboard 中直接添加 UIImageView,autolayout 设置填满整个屏幕。
2、图片资源直接引用刚才添加的图片
3、设置后你会发现上面显示的是3.5寸的图片,这不用理会它,直接运行起来,你会发现能够不同尺寸加载不同启动图。
这方式需要注意一个问题:如果你的项目有多个 target 需要配置多套启动图,就需要建立多个 LaunchScreen.storyboard,并注意导入的多套启动图名称不能相同,会导致各个 target 的启动图都加载不出来。
最后
以上就是我总结的几种可行的方式,用哪种方式就仁者见仁智者见智了,如果大家还有什么更好的方案,欢迎一起讨论。
iOS 13使用LaunchScreen.storyboard适配各尺寸启动图
http://chenzhao.date/2020/10/19/iOS 13使用LaunchScreen.storyboard适配各尺寸启动图.html
install_url
to use ShareThis. Please set it in _config.yml
.